// 搜索栏的参数配置
import { DomForT, defaultDom, SelectType, fieldForm, yesOrNo, isHaveOption } from '../index'
import { searchFormTypeList, SearchFormComponentPropsItemArr } from './search'
import SetupFormItem from './SetupFormItem.vue'
interface FormTypeT {
  label: string
  value: string
  template: string
}
/** 搜索栏可用的类型 */
const FormTypeList: FormTypeT[] = [
  ...searchFormTypeList,
  {
    label: '自动补全',
    value: 'Autocomplete',
    template: 'Autocomplete'
  },
  {
    label: '开关',
    value: 'Switch',
    template: 'Switch'
  },
  {
    label: '单选',
    value: 'RadioGroup',
    template: 'RadioGroup'
  },
  {
    label: '单选按钮',
    value: 'RadioButton',
    template: 'RadioButton'
  },
  {
    label: '滑块',
    value: 'Slider',
    template: 'Slider'
  },
  {
    label: '数字输入框',
    value: 'InputNumber',
    template: 'InputNumber'
  },
  {
    label: '上传组件',
    value: 'Upload',
    template: 'Upload'
  }
]
// 搜索栏的form配置项列表
const searchForm: SelectType[] = [
  ...fieldForm,
  {
    label: '类型',
    type: '类型',
    value: 'component'
  },
  {
    label: '初始值',
    type: 'input',
    value: 'value'
  },
  {
    label: '是否隐藏',
    type: 'radio',
    value: 'remove',
    hint: '如果为true，会连同值一同删除，类似v-if',
    options: yesOrNo
  },
  {
    label: '样式隐藏',
    type: 'radio',
    value: 'hidden',
    hint: '样式隐藏，不会把值一同删掉，类似v-show',
    options: yesOrNo
  }
]
/** 搜索栏整合表单 */
const FormComponentPropsItemArr: DomForT = {
  ...SearchFormComponentPropsItemArr,
  Autocomplete: {
    componentProps: [
      defaultDom.inputDivider,
      defaultDom.placeholder,
      defaultDom.clearable,
      defaultDom.size,
      {
        label: '防抖延时',
        type: 'inputNumber',
        value: 'debounce'
      }
    ],
    componentPropsStyle: [defaultDom.minWidth, defaultDom.maxWidth],
    formItemPropsStyle: [
      defaultDom.FormItemDivider,
      defaultDom.marginRight,
      defaultDom.marginBottom
    ]
  },
  Switch: {
    componentProps: [
      defaultDom.size,
      defaultDom.disabledB,
      defaultDom.loading,
      defaultDom.width,

      {
        label: '打开时的文字描述',
        type: 'input',
        value: 'activeText'
      },
      {
        label: '关闭时的文字描述',
        type: 'input',
        value: 'inactiveText'
      }
    ]
  },
  RadioGroup: {
    componentProps: [
      defaultDom.size,
      defaultDom.disabledB,
      {
        label: '激活时的文本颜色',
        type: 'input',
        value: 'textColor'
      },
      {
        label: '激活时填充色边框色',
        type: 'input',
        value: 'fill'
      },
      {
        label: '编辑选项',
        type: 'optionsJson',
        value: 'options'
      }
    ],
    componentPropsOptions: [defaultDom.label, defaultDom.value, defaultDom.disabled],
    componentPropsProps: [
      defaultDom.propsDivider,
      defaultDom.propsLabel,
      defaultDom.propsValue,
      defaultDom.disabled
    ]
  },
  RadioButton: {
    componentProps: [
      defaultDom.size,
      defaultDom.disabledB,
      {
        label: '激活时的文本颜色',
        type: 'input',
        value: 'textColor'
      },
      {
        label: '激活时填充色边框色',
        type: 'input',
        value: 'fill'
      },
      {
        label: '编辑选项',
        type: 'optionsJson',
        value: 'options'
      }
    ],
    componentPropsOptions: [defaultDom.label, defaultDom.value, defaultDom.disabled],
    componentPropsProps: [
      defaultDom.propsDivider,
      defaultDom.propsLabel,
      defaultDom.propsValue,
      defaultDom.disabled
    ]
  },
  Slider: {
    componentProps: [
      defaultDom.size,
      defaultDom.disabledB,
      defaultDom.min,
      defaultDom.max,
      defaultDom.step,
      {
        label: '是否显示输入框',
        type: 'radio',
        value: 'showInput',
        options: isHaveOption
      },
      {
        label: '输入框控制按钮',
        type: 'radio',
        value: 'showInputControls',
        options: isHaveOption
      },
      {
        label: '是否显示间断点',
        type: 'radio',
        value: 'showStops',
        options: yesOrNo
      }
    ]
  },
  InputNumber: {
    componentProps: [
      defaultDom.size,
      defaultDom.disabledB,
      defaultDom.min,
      defaultDom.max,
      defaultDom.step,
      {
        label: '小数点位数',
        type: 'inputNumber',
        value: 'precision ',
        hint: '值必须是一个非负整数，并且不能小于 step 的小数位数。'
      }
    ]
  },
  Upload: {
    componentProps: [
      {
        label: '请求 URL',
        type: 'input',
        value: 'action '
      },
      {
        label: '请求方法',
        type: 'input',
        value: 'method ',
        options: [
          { label: 'post', value: 'post' },
          { label: 'get', value: 'get' }
        ]
      },
      {
        label: '是否支持多选文件',
        type: 'radio',
        value: 'multiple',
        options: yesOrNo
      },
      {
        label: '上传的文件字段名',
        type: 'input',
        value: 'name'
      },
      {
        label: '接受上传的文件类型',
        type: 'input',
        value: 'accept'
      },
      defaultDom.disabledB
    ]
  }
}

export { SetupFormItem, FormComponentPropsItemArr, FormTypeList, searchForm }
